<template>
  <div id="OrderDetails">
    <el-button type="primary" class="goback" @click="goback">返回上一级</el-button>
    <div class="listmsg">
      <h3 class="title">订单详情</h3>
      <el-collapse accordion>
        <el-collapse-item v-for="(aitem,idx) in datalist.orderProducts" :name="idx" :key="idx">
          <template slot="title">
            <div class="good_title">
              <span class="listname">商品名称</span>
              <span class="listval">{{ aitem.goodsName }}</span>
            </div>
          </template>
          <div
            v-for="(val,num) in aitem"
            v-if="(val&&list.orderProducts[num]&&num!='goodsName')"
            :key="num"
            class="orderProducts Fill_border"
          >
            <div :class="num=='goodsPicture'?'r_border':'listname'">{{ list.orderProducts[num] }}</div>
            <span v-if="num!='goodsPicture'" class="listval">{{ val }}</span>
            <a v-else :href="val" target="_blank" class="Goods_Picture">
              <img :src="val" alt="1" class="goodsPicture">
            </a>
          </div>
        </el-collapse-item>
        <el-collapse-item v-if="datalist.omsLogistics">
          <template slot="title">
            <div class="good_title">
              <span class="listname">物流信息</span>
              <span class="listval">物流</span>
            </div>
          </template>
          <div
            v-for="(item, index) in datalist.omsLogistics"
            v-if="item"
            :key="index"
            class="orderProducts Fill_border"
          >
            <div class="listname">
              <span>{{ list.omsLogistics[index] }}</span>
            </div>
            <span class="listval">{{ item }}</span>
          </div>
        </el-collapse-item>
      </el-collapse>
      <div
        v-for="(item,key) in datalist"
        v-if="key!='orderProducts' && key != 'omsLogistics'"
        v-show="item&&list[key]"
        :key="key"
        class="list Fill_border"
      >
        <div class="listname">{{ list[key] }}</div>
        <span class="listval">{{ item }}</span>
      </div>
    </div>
  </div>
</template>

<script>
import {
    indentDetails,
} from "@/api/shoppingCentre/pay_shipments.js"
import Data from './index.js'
export default {
  data() {
    return JSON.parse(JSON.stringify(Data))
  },
  created() {
    this.getIndentDetails()
  },

  methods: {
    goback() {
       if (this.$route.query.num == '1') {
           this.$router.push({ name: 'userDetails',query : {id : this.$route.query.userId}})
       } else {
           this.$router.push({ path: 'indentAdmin' })
       }

    },
    getIndentDetails () {
      indentDetails(JSON.parse(this.$route.query.data)).then(res=>{
         if (res.data.code == 'OK') {
               var newdata = res.data.data;
               // 过滤
               //	用户售后状态
               switch (newdata.afterStatus) {
                 case '0':
                   newdata.afterStatus = '未发起售后'
                   break
                 case '1':
                   newdata.afterStatus = '申请售后'
                   break
                 case '-1':
                   newdata.afterStatus = '售后已取消'
                   break
                 case '2':
                   newdata.afterStatus = '处理中'
                   break
                 case '3':
                   newdata.afterStatus = '处理完毕'
                   break
               }
               //  订单取消的方式   cancelType
               switch (newdata.cancelType) {
                 case '1':
                   newdata.cancelType = '用户取消'
                   break
                 case '2':
                   newdata.cancelType = '平台取消'
                   break
                 case '3':
                   newdata.cancelType = '超时自动取消'
                   break
               }
               // 配送运费金额     deliveryTotalFee
               switch (newdata.deliveryTotalFee) {
                 case '1':
                   newdata.deliveryTotalFee = '0'
                   break
                 case '2':
                   newdata.deliveryTotalFee = '24'
                   break
                 case '3':
                   newdata.deliveryTotalFee = '0'
                   break
               }
               // 配送方式  deliveryType
               switch (newdata.deliveryType) {
                 case 1:
                   newdata.deliveryType = '包邮'
                   break
                 case 2:
                   newdata.deliveryType = '顺丰在线支付快递费用'
                   break
                 case 3:
                   newdata.deliveryType = '顺丰到付'
                   break
               }
               //  用户删除订单
               switch (newdata.isExists) {
                 case 'Y':
                   newdata.isExists = '未删除'
                   break
                 case 'N':
                   newdata.isExists = '删除'
                   break
               }
               //  商品是否有效:Y/N
               switch (newdata.orderProducts.goodsIsExists) {
                 case 'Y':
                   newdata.goodsIsExists = '是'
                   break
                 case 'N':
                   newdata.goodsIsExists = '否'
                   break
               }
               for (var i in newdata.orderProducts) {
                 switch (newdata.orderProducts[i].goodsIsExists) {
                   case 'Y':
                     newdata.orderProducts[i].goodsIsExists = '是'
                     break
                   case 'N':
                     newdata.orderProducts[i].goodsIsExists = '否'
                     break
                 }
               }
               switch (newdata.orderStatus) {
                 case '1000':
                   newdata.orderStatus = '下单完成，未付款'
                   break
                 case '1001':
                   newdata.orderStatus = '已付款，代发货'
                   break
                 case '1002':
                   newdata.orderStatus = '已发货，代签收'
                   break
                 case '1003':
                   newdata.orderStatus = '已签收'
                   break
                 case '1004':
                   newdata.orderStatus = '退货申请'
                   break
                 case '1005':
                   newdata.orderStatus = '退货中'
                   break
                 case '1006':
                   newdata.orderStatus = '已退货'
                   break
                 case '1007':
                   newdata.orderStatus = '取消交易'
                   break
               }
               // 物流分类
               if (newdata.omsLogistics) {
                 switch (newdata.omsLogistics.logisticsType) {
                   case 'A1':
                     newdata.omsLogistics.logisticsType = '快递寄卖物流'
                     break
                   case 'A2':
                     newdata.omsLogistics.logisticsType = '快递寄件物流'
                     break
                   case 'B1':
                     newdata.omsLogistics.logisticsType = '赎回寄件物流'
                     break
                   case 'C1':
                     newdata.omsLogistics.logisticsType = '评估师发货物流单'
                     break
                   case 'D1':
                     newdata.omsLogistics.logisticsType = 'GO精品物流'
                     break
                   case 'D2':
                     newdata.omsLogistics.logisticsType = 'GO精品售后物流'
                     break
                 }
                 switch (newdata.omsLogistics.logicalDeletion) {
                   case 'E':
                     newdata.omsLogistics.logicalDeletion = '可用'
                     break
                   case 'D':
                     newdata.omsLogistics.logicalDeletion = '不可用'
                     break
                 }
                 newdata.omsLogistics.gmtCreate = this.switchTime(newdata.gmtCreate)
                 newdata.omsLogistics.gmtUpdate = this.switchTime(newdata.gmtUpdate)
               }
               // 时间戳过滤
               newdata.acceptTime = this.switchTime(newdata.acceptTime)
               newdata.cancelTime = this.switchTime(newdata.cancelTime)
               newdata.checkTime = this.switchTime(newdata.checkTime)
               newdata.deliveryTime = this.switchTime(newdata.deliveryTime)
               newdata.orderTime = this.switchTime(newdata.orderTime)
               newdata.payTime = this.switchTime(newdata.payTime)

               // console.log(newdata)
               this.datalist = newdata
         }
        console.log(res);
      })
    }
  }
}
</script>
<style scoped lang="css">
#OrderDetails {
  width: 100%;
  height: 100%;
}
.title {
  width: 100%;
  text-align: center;
}
.goback {
  margin-top: 15px;
}
.table {
  width: 800px;
  border: 1px solid #ccc;
  background-color: #fff;
  margin-top: 20px;
}
.tab-val {
  display: flex;
  flex-wrap: wrap;
  padding-left: 20px;
  border-left: 1px solid #ccc;
  box-sizing: border-box;
  min-height: 60px;
  align-items: center;
  padding-top: 10px;
}
.tab-item {
  width: 100%;
  display: flex;
  padding: 0 10px;
  box-sizing: border-box;
  border-top: 1px solid #ccc;
  min-height: 60px;
  align-items: center;
}
.tab-item .tab-name {
  min-width: 120px;
  min-height: 60px;

  display: flex;
  align-items: center;
}
#OrderDetails .listmsg {
  width: 800px;
  border: 1px solid #ccc;
  background-color: #fff;
  margin-top: 20px;
  height: 100%;
  color: #000000;
  margin-bottom: 30px;
}

.Fill_border {
  border-top: 1px solid #ccc;
  font-size: 14px;
}

#OrderDetails .listmsg .list,
.el-collapse .orderProducts {
  display: flex;
  align-items: center;
}

#OrderDetails .listmsg .list .listname,
.el-collapse .orderProducts .listname {
  padding: 20px;
  width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-right: 1px solid #ccc;
}
#OrderDetails .listmsg .list .listval,
.el-collapse .orderProducts .listval {
  min-width: 500px;
  padding: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.el-collapse .orderProducts .listval {
  padding-left: 20px;
}
/* 手风琴 */
.good_title {
  display: flex;
  align-items: center;
}
.good_title .listname {
  padding: 16px;
  padding-left: 20px;
  width: 180px;
  overflow: hidden;
  border-right: 1px solid #ccc;
}
.good_title .listval {
  min-width: 500px;
  padding-left: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.el-collapse .orderProducts {
  display: flex;
}

#OrderDetails /deep/ .el-collapse-item__content {
  padding-bottom: 0;
}
#OrderDetails /deep/ .el-collapse-item .el-collapse-item__header {
  border-bottom: 1px solid #ccc;
  height: 100%;
}
#OrderDetails /deep/ .el-collapse-item:last-child .el-collapse-item__header {
  border: 0;
}
#OrderDetails /deep/ .el-collapse-item .Fill_border:first-child {
  border-top: 0;
}
#OrderDetails /deep/ .el-collapse-item:last-child .Fill_border:first-child {
  border-top: 1px solid #ccc;
}
#OrderDetails /deep/ .el-collapse-item__wrap {
  border-bottom: 1px solid #ccc;
}
#OrderDetails /deep/ .el-collapse-item:last-child .el-collapse-item__wrap {
  border-bottom: 0;
}
/* 控制手风琴标题栏右边图标 */
#OrderDetails /deep/ .el-collapse-item__header .el-collapse-item__arrow {
  line-height: 76px;
}

.el-collapse {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.Goods_Picture {
  display: block;
  padding: 10px;
}

.goodsPicture {
  max-width: 140px;
  max-height: 140px;
  display: block;
}
.r_border {
  width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-right: 1px solid #ccc;
  padding: 10px;
  height: 160px;
  line-height: 160px;
  padding-left: 20px;
}
</style>
